<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="common/common :: header"/>
    <title>[[#{user.login.need.reset}]]</title>
</head>
<body>
<div class="container">
    <div class="row">
        <div class="col-md-6 col-md-offset-3">
            <div class="panel panel-primary">
                <div class="panel-heading">
                    <h3 class="panel-title">[[#{user.login.need.reset}]]</h3>
                </div>
                <div class="panel-body">
                    <form id="resetPwdForm">
                        <input type="hidden" id="userUuid" th:value="${session.needResetUserId}">
                        <div class="form-group">
                            <label for="newPassword">[[#{user.new.pwd}]]</label>
                            <input type="password" id="newPassword" class="form-control"
                                   placeholder="[[#{user.pwd.format.tip}]]" required>
                            <small class="text-muted">[[#{user.pwd.format.desc}]]</small>
                        </div>
                        <div class="form-group">
                            <label for="confirmPassword">[[#{user.confirm.pwd}]]</label>
                            <input type="password" id="confirmPassword" class="form-control" required>
                        </div>
                        <button type="button" class="btn btn-primary" onclick="submitNewPassword()">
                            [[#{common.confirm}]]
                        </button>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>

<script>
    function submitNewPassword() {
        var userUuid = $('#userUuid').val();
        var newPwd = $('#newPassword').val();
        var confirmPwd = $('#confirmPassword').val();

        if (newPwd !== confirmPwd) {
            message('[[#{user.pwd.not.match}]]', 'error');
            return;
        }

        // 密码格式验证
        if (!/^(?=.*[A-Za-z])(?=.*\d)[A-Za-z\d]{8,}$/.test(newPwd)) {
            message('[[#{user.pwd.format.error}]]', 'error');
            return;
        }

        $.post('[[@{/user/setNewPassword}]]', {
            userUuid: userUuid,
            newPassword: newPwd
        }, function(data) {
            if (data.success) {
                message(data.msg);
                setTimeout(function() {
                    window.location.href = '[[@{/login/main}]]';
                }, 1500);
            } else {
                message(data.msg, 'error');
            }
        }, 'json');
    }
</script>
</body>
</html>